<template>
  <fieldset>
    <legend>购物车</legend>
    <h1>购物车:cart</h1>
    <ul>
      <li v-for="item in cartData" :key="item.id">
        <b>产品：{{ item.title }}</b>
        ---
        <b>价格：{{ item.price }}</b>
        ---
        <b>数量：{{ item.count }}</b>
        ---
        <button>-</button>
      </li>
    </ul>
    <h1>总价：{{ total }}</h1>
  </fieldset>
</template>
<script>
import { mapState, mapGetters } from "vuex";
export default {
  computed: {
    ...mapState("cart", ["cartData"]),
    ...mapGetters("cart", ["total"]),
  },
};
</script>
<style lang="scss" scoped></style>
